<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"
	import="com.ffcs.crmd.platform.ui.utils.JspUtil"%>
<!DOCTYPE html>
<jsp:include page="/resources/theme/default/include/default-header-inc.jsp"></jsp:include>
<jsp:include page="/resources/theme/default/include/default-footer-inc.jsp"></jsp:include>
<html>
<head>
	<title>角色管理</title>
	<script type="text/javascript" src="../sys-service.js"></script>
    <script type="text/javascript" src="./role-controller.js"></script>
</head>
<body ng-app="sysRoleApp" ng-controller="sysRoleCtrl" style="background-color: transparent;">
	<div class="container-fluid content">
		<div class="page-left-layout" style="margin-top: 12px;">
			<div class="panel">
				<div class="panel-heading">
					<i class="mark"></i>角色列表
				</div>
				<div class="panel-body">
					<div id="toolbar" class="btn-group">
						<button id="addRoleButton" class="btn btn-sm btn-blue" data-toggle="modal" data-target="#roleEditModal" ng-click="action='ADD_ROLE'">
							<i class="glyphicon glyphicon-plus"></i>
						</button>
						<button id="removeRoleButton" class="btn btn-sm btn-blue" ng-click="deleteRole()" disabled>
							<i class="glyphicon glyphicon-remove"></i>
						</button>
					</div>
					<div id="catalogTree">
						<div jstree 
							tree-config="roleTreeConfig.config" 						
							tree-status="roleTreeConfig.status" 						
							tree-multiple="roleTreeConfig.multiple" 					
							tree-animation="roleTreeConfig.animation" 					
							tree-events="select_node:roleTreeConfig.events.selectNode"  
							tree-data="roleTreeConfig.data" 							
							tree-selected="roleTreeConfig.selected" 					
							tree-types="roleTreeConfig.types" 							
							tree-plugins="roleTreeConfig.plugins" 						
							tree-icons="roleTreeConfig.icons"
							tree-search="roleTreeConfig.search"></div>
					</div>
				</div>
			</div>
		</div>
		
		<div class="page-right-layout" style="margin-top: 12px;">
			<div class="panel" style="margin-bottom: 0px;">
				<div class="panel-heading">
					<i class="mark"></i>用户列表
				</div>
				<div class="panel-body">
					<div class="table-responsive">
						<div id="usertabletoolbar" class="btn-group">
							<button id="addUserButton" class="btn btn-sm btn-blue" data-toggle="modal" data-target="#roleEditModal" ng-click="action='ADD_USER'">
								<i class="glyphicon glyphicon-plus-sign"></i> 新增
							</button>
							<button id="removeUserButton" class="btn btn-sm btn-blue" ng-click="deleteUser()" disabled>
								<i class="glyphicon glyphicon-remove"></i> 删除
							</button>
						</div>
						<table id="userRoleTable" 
							data-id-field="id"
							data-side-pagination="server"
							data-toolbar="#usertabletoolbar" 
							data-row-style="rowStyle"
							data-pagination="true" 
							data-click-to-select="true"
							data-page-size="5" 
							data-query-params-type=""
							data-page-list="[5, 10, 20]">
							<thead>
								<tr>
									<th data-checkbox='true' />
									<th data-field="userName">用户名</th>
								</tr>
							</thead>
						</table>
					</div>
				</div>
			</div>
			
			<div class="panel">
				<div class="panel-heading">
					<i class="mark"></i>权限列表
				</div>
				<div class="panel-body" style="padding-top: 0px;">
					<div id="tabletoolbar" class="btn-group">
						<button id="addPrivButton" class="btn btn-sm btn-blue" data-toggle="modal" data-target="#roleEditModal" ng-click="action='ADD_PRIV'">
							<i class="glyphicon glyphicon-plus-sign"></i> 新增
						</button>
						<button id="removePrivButton" class="btn btn-sm btn-blue" ng-click="deletePriv()" disabled>
							<i class="glyphicon glyphicon-remove"></i> 删除
						</button>
					</div>
					<div class="table-responsive">
						<table id="rolePrivTable"
							data-id-field="id"
							data-side-pagination="server"
							data-toolbar="#tabletoolbar" 
							data-row-style="rowStyle"
							data-pagination="true" 
							data-page-size="5" 
							data-query-params-type=""
							data-page-list="[5, 10, 20]">
							<thead>
								<tr>
									<th data-checkbox='true'/>
									<th data-field="privilegeName">权限名</th>
								</tr>
							</thead>
						</table>
					</div>
				</div>
			</div>
		</div>

		<div>
			<jsp:include page="role-catalog-eidt.jsp"></jsp:include>
		</div>
	</div>
</body>
</html>